"use client";
import { PaletteMode, Paper } from "@mui/material";
import Box from "@mui/material/Box";
import CssBaseline from "@mui/material/CssBaseline";
import { ThemeProvider, alpha, createTheme } from "@mui/material/styles";
import { message } from "antd";
import * as React from "react";
import AppAppBar from "./components/AppAppBar";
import getLPTheme from "./getLPTheme";

export default function DashboardLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const [mode, setMode] = React.useState<PaletteMode>("light");
  const LPtheme = createTheme(getLPTheme(mode));
  const defaultTheme = createTheme({ palette: { mode } });

  message.config({
    duration: 2,
    maxCount: 2,
  });

  const toggleColorMode = () => {
    // 黑白主题定制
    // setMode((prev) => (prev === "dark" ? "light" : "dark"));
  };

  return (
    <>
      <ThemeProvider theme={LPtheme}>
        <CssBaseline />
        <AppAppBar mode={mode} toggleColorMode={toggleColorMode} />
      </ThemeProvider>

      <ThemeProvider theme={defaultTheme}>
        <Box sx={{ display: "flex", flexDirection: "column", height: "100vh" }}>
          <Box
            id="hero"
            sx={(theme) => ({
              flex: 1,
              width: "100%",
              backgroundImage:
                theme.palette.mode === "light"
                  ? "linear-gradient(180deg, #CEE5FD, #FFF)"
                  : `linear-gradient(#02294F, ${alpha("#090E10", 0.0)})`,
              backgroundRepeat: "no-repeat",
              backgroundSize: "100% 30%",
            })}
          >
            {children}
          </Box>
          <div id="gmps_footer">
            <Box
              sx={{
                textAlign: "center",
                fontSize: "12px",
                width: "100%",
              }}
            >
              <Paper sx={{ background: "rgb(250, 250, 250)" }}>
                <div>
                  Address: 1068 Xueyuan Avenue Shenzhen University Town Shenzhen
                  P.R.China
                </div>
                <div>
                  Copyright: ©Shenzhen Institute of Advanced Technology, Chinese
                  Academy of Sciences
                </div>
              </Paper>
            </Box>
          </div>
        </Box>
      </ThemeProvider>
    </>
  );
}
